<template>
    <h1>创作中心</h1>
    <!-- <el-tabs v-model="check" class="demo-tabs" @tab-click="handleClick"> -->
    <!-- <el-tab-pane label="待审核" name="toCheck">
            <CheckRecord :centerData="toCheckData"/>
        </el-tab-pane> -->
    <SubmitRecord :centerData="toCheckData" />
    <!-- </el-tabs> -->
    <div class="button-group">
        <button @click="create" class="btn btn-primary">新建</button>
        <button @click="cancel" class="btn btn-secondary">取消</button>
    </div>
</template>

<script>
import SubmitRecord from '../components/SubmitRecord.vue';
import { ref, onMounted } from 'vue';
import _axios from '../axios/index';
import { useRouter } from 'vue-router';
export default {
    components: {
        SubmitRecord
    },
    setup() {
        const check = ref('toCheck');
        const toCheckData = ref([]);
        const router = useRouter();

        async function getToCheckData() {
            const userStr = sessionStorage.getItem("user");
            const userData = JSON.parse(userStr); // 解析为对象
            const user_id = userData.user.user_id;
            let result = await _axios.get("/submit/check", { params: { user_id: user_id } });
            let r = result.data;
            //alert(JSON.stringify(r.data));
            toCheckData.value = r.data;
        }

        onMounted(() => {
            getToCheckData();
        });

        function create() {
            router.push("/submit");
        }
        function cancel() {
            router.push("/home");
        }

        return {
            check,
            toCheckData,
            create,
            cancel
        }
    }
}
</script>

<style scoped>
.button-group {
    text-align: center;
    margin-top: 20px;
}

.btn {
    padding: 10px 20px;
    font-size: 16px;
    color: white;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    margin: 0 5px;
}

.btn-primary {
    background-color: #007bff;
}

.btn-primary:hover {
    background-color: #0056b3;
}

.btn-secondary {
    background-color: #6c757d;
}

.btn-secondary:hover {
    background-color: #545b62;
}
</style>